<template>
  <div class="parent-container">
    <h1>parent</h1>

    <Child :name='name' />
  </div>
</template>

<script lang="ts">
import { defineComponent, ref } from 'vue'
import Child from '@/components/ChildComponent.vue'

export default defineComponent({
  name: 'Parent',

  components: { Child },

  emits: {
    hello: val => {
      console.log(val)
      return true
    },
    bye: val => {
      console.log(val)
      return true
    }
  },

  data () {
    return {
      age: 18
    }
  },

  setup () {
    const name = ref<string>('Child')

    return {
      name
    }
  }
})
</script>
